﻿<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head th:replace="common/adminAll :: head(~{::title})">
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
        <title>订单管理</title>
<!--        <script th:src="@{/style/js/jquery.min.js}"></script>-->
<!--        <link rel="stylesheet" th:href="@{/style/css/default.css}">-->
<!--        <link rel="stylesheet" th:href="@{/style/css/bootstrap-table.css}">-->
<!--        <link rel="stylesheet" th:href="@{/style/css/bootstrap-table.min.css}">-->
<!--        <script th:src="@{/style/js/bootstrap.min.js}"></script>-->
<!--        <script th:src="@{/style/js/bootstrap-table.min.js}"></script>-->
<!--        <script th:src="@{/style/js/bootstrap-table-zh-CN.min.js}"></script>-->
<!--        <script th:src="@{/style/js/sweetalert.min.js}"></script>-->
<!--        <script th:src="@{/style/js/custom.js}"></script>-->
<!--        <script th:src="@{/style/js/dayjs.min.js}"></script>-->
<!--        <script th:src="@{/style/js/main.js}"></script>-->
    </head>

    <body>
        <!--头部信息栏部分  begin-->
        <header th:replace="common/adminAll::header"></header>
        <!--头部信息栏部分 end-->

        <!--页面主题部分开始-->
        <section>
            <div class="mainwrapper">
                <!--侧变导航栏部分  begin-->
                <div th:replace="common/adminAll::leftMain(2)"></div>
                <!--侧变导航栏部分 end-->


                <!--左边主题显示部分开始-->
                <div class="mainpanel">
                    <div class="contentpanel" style="height: 1200px;">
                        <!--面板开始-->
                        <div class="panel panel-default">
                            <!--面板标题开始-->
                            <div class="panel-heading">
                                <h4 class="panel-title">订单管理</h4>
                                <p>查看订单信息</p>
                            </div>
                            <!--面板标题结束-->

                            <!--面板主体开始-->
                            <div class="panel-body">
                                <!--图书数据展示-->
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="col-md-12">
                                            <table class="table table-hover table-bordered" id="table"></table>
                                        </div>
                                    </div>
                                </div>
                                <!--图书数据展示结束-->
                            </div>
                            <!--面板主体结束-->
                        </div>
                        <!--面板结束-->
                    </div><!-- contentpanel -->
                </div>
                <!--左边主题显示部分结束-->
            </div>
        </section>
        <!--页面主题部分结束-->

        <!-- 模态框开始 -->
        <div th:replace="common/adminModalAll::mainModal"></div>
        <!--模态框结束-->
    </body>

    <script th:inline="javascript">
        var contextPath = [[${#request.getContextPath()}]];
    </script>

    <script>
        $("#table").bootstrapTable({
            url:"getAllOrder",
            method:"get",
            sidePagination: "client",
            pageSize: 5,
            pageList: [5, 10, 20, 30, 50],
            cache:false,
            striped:true,
            pagination:true,
            sortable:true,
            sortOrder:"asc",
            search:true,
            showRefresh: true,
            clickToSelect:true,
            paginationPreText: "上一页",   //上一页文字
            paginationNextText: "下一页",  //下一页文字
            showButtonText: true,   //显示按钮文字
            paginationHAlign: "left",   //页数选择栏在左边
            paginationDetailHAlign: "right",    //页面大小选择在右边
            showToggle: true,
            columns:[
                { field: 'id', title: 'id',visible:false },
                { field: 'SerialNumber', title: '序号',
                    formatter: function (value, row, index) {
                        return index+1;
                    }
                },
                { field: 'orderNum', title: '订单编号' },
                { field: 'createDate', title: '下单日期',
                  formatter: function (value, row, index) {
                     return dayjs(value).format('YYYY-MM-DD HH:mm:ss')
                  }
                },
                { field: 'orderStatus', title: '订单状态',
                  formatter: function (value, row, index) {
                    var result=""
                    switch (value){
                        case "1":
                            return result+='<span class="label label-danger">未付款</span>'
                        case "2":
                            return result+='<span class="label label-info">已付款</span>'
                        case "3":
                            return result+='<span class="label label-success">交易成功</span>'
                    }
                  }
                },
                { field: 'deliveryStatus', title: '发货状态',
                    formatter: function (value, row, index) {
                        var result=""
                        switch (value){
                            case "0":
                                return result+='<span class="label label-danger">未发货</span>'
                            case "1":
                                return result+='<span class="label label-success">已发货</span>'
                        }
                    }
                },
                { field: 'operate',
                    title: '操作',
                    align: 'center',
                    valign: 'middle',
                    width: 220,
                    events: {
                        'click #detailInfo': function (e, value, row, index) {
                            toDetailPage(row.id)
                        },
                        'click #update': function (e, value, row, index) {
                            updateOrderDelivery(row.id,row.orderStatus)
                        }
                    },
                    formatter: function (value, row, index) {
                        var result = "";
                        result += '<button id="detailInfo" class="btn btn-info">详情</button>';
                        if(row.deliveryStatus === '0'){
                            result += '<button id="update" class="btn btn-primary" style="margin-left:10px;">发货</button>';
                        }else {
                            result += '<button disabled class="btn btn-primary" style="margin-left:10px;">发货</button>';
                        }
                        return result;
                    }
                }
            ]
        })
    </script>
</html>
